<template>
  <basic-dialog
    :visible="diaVisible"
    :title="'导入记录'"
    :show-footer="false"
    :handle-close="onCancel"
  >
    <div>
      <basic-Table
        :loading="tableLoading"
        :data-source="recordList"
        :columns="columns"
        :show-select-col="false"
        :pagination="pagination"
        :pageSizes="pageSizes"
        @pageChange="handlePageChange"
        @pageSizeChange="handlePageSizeChange"
      />
    </div>
  </basic-dialog>
</template>
<script>
import BasicDialog from '@/components/BasicDialog';
import BasicTable from '@/components/BasicTable';
import { ApiRequest } from '@api/basePage';
import { isResponseSuccess } from '@/utils/bizUtils';

export default {
  name: 'RecordDialog',
  components: {
    BasicDialog,
    BasicTable
  },
  props: {
    visible: {
      type: Boolean
    },
    batchNo: {
      type: String,
      default: ''
    }
  },
  data () {
    return {
      tableLoading: false,
      columns: [
        {
          title: '时间',
          key: 'createdAt'
        },
        {
          title: '操作人',
          key: 'createdUserName'
        },
        {
          title: '导入类型',
          key: 'operateTypeName'
        },
        {
          title: '文件名',
          key: 'fileName'
        },
        {
          title: '文件大小',
          key: 'fileSize'
        }
      ],
      recordList: [],
      pagination: {
        nowPage: 1,
        totalNum: 0,
        pageShow: 10,
      },
      pageSizes: [10, 20, 30, 40]
    };
  },
  computed: {
    diaVisible () {
      return this.visible;
    },
  },
  methods: {
    onCancel () {
      this.$emit('hide-dialog');
    },
    // 导出文件
    getRecordService (param) {
      this.tableLoading = true;
      ApiRequest(`/dataBatch/purchasePrice/file/page`, 'post', param).then(
        (res) => {
          this.tableLoading = false;
          if (isResponseSuccess(res)) {
            this.recordList = res.retData.records;
            this.pagination.totalNum = res.retData.total;
          }
        }
      ).catch(() => {
        this.tableLoading = false;
      });
    },
    handleGetRecord (initPage) {
      const param = {
        data: {
          batchNo: this.batchNo,
          operateTypes: [20, 40]
        },
        pageNum: initPage || this.pagination.nowPage,
        pageSize: this.pagination.pageShow
      };
      this.getRecordService(param)
    },
    handlePageChange (val) {
      this.pagination.nowPage = val;
      this.handleGetRecord();
    },
    handlePageSizeChange (val) {
      this.pagination.pageShow = val;
      this.handleGetRecord();
    }
  }
};
</script>
